<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>伪类测试</title>
	<style type="text/css">
		code {
			background-color: #f9f2f4;
			color: #c7254e;
			padding-left: 2px;
			padding-right: 2px;
			margin-right: 5px;
		}

		a:link {
			color: #0477C0;
			text-decoration: none;
		}
		a:visited {
			color: gray;
		}
		a:hover {
			color: red;
		}
		a:active {
			color: green;
		}
	</style>
</head>
<body>
	<ul>
		<li><code>:link</code>设置 a 元素在未被访问前的 CSS 样式</li>
		<li><code>:visited</code>设置 a 元素在其链接地址已被访问过时的 CSS 样式</li>
		<li><code>:hover</code>设置元素在其鼠标悬停时的 CSS 样式</li>
		<li><code>:active</code>设置元素在被用户激活（在鼠标点击与释放之间发生的事件）时的 CSS 样式</li>
	</ul>
	<ul>
		<li><a href="#1">链接1</a></li>
		<li><a href="#2">链接2</a></li>
		<li><a href="#3">链接3</a></li>
		<li><a href="#4">链接4</a></li>
	</ul>
</body>
</html>

